<template>
  <view class="content_comment uni-flex uni-row">
    <view class="left_view">
      <image class="image_head" :src="data.avatarUrl" />
    </view>
    <view class="right_view">
      <text class="text_name">{{ data.nickName }}</text>
      <view>
        <text class="text_content">
          {{ data.content }}
        </text>
      </view>
      <view style="margin-top: 10px;">
        <text class="text_comment_time">{{ datetimeComputed }}</text>
        <view style="float: right;">
          <uni-icons type="hand-up" size="23" />
          <text class="text_endorse">{{ data.endorse }}</text>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { formatDate } from '@/common/util.js'
export default {
  props: {
    data: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
				
    }
  },
  computed: {
    datetimeComputed() {
      return formatDate(this.data.datetime * 1000)
    }
  },
  methods: {
			
  }
} 
</script>

<style lang="scss" scoped>
	.content_comment{
		margin-top: 15px;
		min-height: 50px;
		flex-direction: row;
		display: flex;
		.left_view{
			.image_head{
				margin-top: 3px;
				width: 35px;
				height: 35px;
				border-radius: 40px;
			}
		}
		.right_view{
			width:85%;
			display: block;
			margin-left: 10px;
			.text_name{
				font-size: 14px;
				font-weight: bold;
			}
			.text_content{
				font-size: 12px;
				height: 50px;
				color: black;
				
			}
			.text_comment_time{
				font-size: 12px;
				color: gray;
			}
			.text_endorse{
				font-size: 15px;
				margin-left: 3px;
			}
		}
	}
</style>
